<template>
  <div class="gxyhzsf" :class="isTopDialog ? 'pointer' : ''" v-if="isLoading">
    <p class="top">
      <span style="font-weight: 700; font-size: 16px; color: #000">{{
        info.residentName
      }}</span>
      <span style="display: inline-block; margin: 0 20px"
        >证件号：{{ info.idNo }}</span
      >
      <span>填表人：{{ info.createUserId }}</span>
    </p>
    <div class="box">
      <span>随访日期：</span>
      <el-date-picker
        v-model="info.visitDate"
        align="right"
        type="date"
        placeholder="选择随访日期"
        :picker-options="pickerOptions"
        size="small"
      >
      </el-date-picker>
    </div>
    <div class="box">
      <span>信息采集方式：</span>
      <el-radio-group v-model="info.collectMode">
        <el-radio label="1">面访时直接录入电子系统</el-radio>
        <el-radio label="2">远程视频随访</el-radio>
        <el-radio label="3">面访时先填写纸质表格，后录入电子系统</el-radio>
      </el-radio-group>
      <div v-if="info.collectMode == '3'">
        <span>采用纸质表格原因：</span>
        <el-radio-group v-model="info.paperReason">
          <el-radio label="1">没有电脑或智能手机</el-radio>
          <el-radio label="2">不会使用电脑，且没有智能手机</el-radio>
          <el-radio label="3">患者家访，且没有智能手机</el-radio>
          <el-radio label="4">其他</el-radio>
          <el-input
            size="small"
            v-model="info.paperReasonOther"
            style="width: 200px"
            v-if="info.paperReason == '4'"
          ></el-input>
        </el-radio-group>
      </div>
    </div>
    <p
      style="font-weight: 900; font-size: 20px; color: #000"
      v-if="info.firstVisit == 1"
    >
      既往史
    </p>
    <div class="box" v-if="info.firstVisit == 1">
      <el-checkbox-group
        v-model="info.pasthistory"
        style="display: inline-block"
      >
        <el-checkbox label="0">无</el-checkbox>
        <el-checkbox label="1">高血压病</el-checkbox>
        <el-checkbox label="2">糖尿病</el-checkbox>
        <el-checkbox label="3">高脂血症</el-checkbox>
        <el-checkbox label="4">冠心病</el-checkbox>
        <el-checkbox label="5">心绞痛</el-checkbox>
        <el-checkbox label="6">心肌梗死</el-checkbox>
        <el-checkbox label="7">冠脉介入(支架)术后</el-checkbox>
        <el-checkbox label="8">冠脉搭桥术后</el-checkbox>
        <el-checkbox label="9">心力衰竭</el-checkbox>
        <el-checkbox label="10">心房颤动</el-checkbox>
        <el-checkbox label="11">脑卒中未分类</el-checkbox>
        <el-checkbox label="12">缺血性脑卒中</el-checkbox>
        <el-checkbox label="13">出血性脑卒中</el-checkbox>
        <el-checkbox label="14">慢性肾脏疾病</el-checkbox>
        <el-checkbox label="15">慢性阻塞性肺病</el-checkbox>
        <el-checkbox label="16">支气管哮喘</el-checkbox>
        <el-checkbox label="17">痛风</el-checkbox>
        <el-checkbox label="18">外周血管病</el-checkbox>
      </el-checkbox-group>
    </div>
    <div class="box" v-if="info.firstVisit == 0">
      <span>新发合并症：</span>
      请选择患者自上次随访以来新发生的下列疾病或情况(可多选)
      <el-checkbox v-model="info.complicationsItems[0].newComplication"
        >无</el-checkbox
      >
      <br />
      <el-checkbox v-model="info.complicationsItems[1].newComplication"
        >新发心绞痛</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[1].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <el-checkbox v-model="info.complicationsItems[2].newComplication"
        >新发缺血性脑卒中</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[2].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <br />
      <el-checkbox v-model="info.complicationsItems[3].newComplication"
        >新发心肌梗死</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[3].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <el-checkbox v-model="info.complicationsItems[4].newComplication"
        >新发出血性脑卒中</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[4].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <br />
      <el-checkbox v-model="info.complicationsItems[5].newComplication"
        >冠脉介入(支架)术后</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[5].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <el-checkbox v-model="info.complicationsItems[6].newComplication"
        >新发脑卒中未分类</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[6].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <br />
      <el-checkbox v-model="info.complicationsItems[7].newComplication"
        >冠脉搭桥术后</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[7].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <el-checkbox v-model="info.complicationsItems[8].newComplication"
        >糖尿病</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[8].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <br />
      <el-checkbox v-model="info.complicationsItems[9].newComplication"
        >新发心力衰竭</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[9].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <el-checkbox v-model="info.complicationsItems[10].newComplication"
        >慢性肾脏疾病</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[10].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <br />
      <el-checkbox v-model="info.complicationsItems[11].newComplication"
        >心房颤动</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[11].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
      <el-checkbox v-model="info.complicationsItems[12].newComplication"
        >外周血管病</el-checkbox
      >
      <el-date-picker
        v-model="info.complicationsItems[12].newComplicationTime"
        size="small"
        style="width: 200px; margin: 5px 15px"
        type="date"
        value-format="yyyy-MM-dd"
        placeholder="选择日期"
      >
      </el-date-picker>
    </div>
    <p style="font-weight: 900; font-size: 20px; color: #000">体格检查</p>
    <div class="box">
      <span>血压：</span>
      <el-input
        placeholder="请输入收缩压"
        v-model="info.constriction"
        style="width: 300px"
        size="small"
      >
        <template slot="append">mmHg</template>
      </el-input>
      <span style="display: inline-block; margin: 0 20px">/</span>
      <el-input
        placeholder="请输入舒张压"
        v-model="info.diastolic"
        style="width: 300px"
        size="small"
      >
        <template slot="append">mmHg</template>
      </el-input>
      <div style="margin-top: 15px; color: #f19332">
        温馨提示：血压测量前请让患者安静放松至少5分钟，测量时不动不说话。每次门诊测量两次，间隔1-2分钟，取两次的平均值记录；如果两次差＞10mmHg，则测量第三次，取后两次的平均值记录。如果首次测量＜140/90mmHg，则不需要额外测量。
      </div>
    </div>
    <div class="box">
      <span>心率：</span>
      <el-input
        placeholder="请输入心率"
        v-model="info.signHeartRate"
        style="width: 300px"
        size="small"
      >
        <template slot="append">次/分钟</template>
      </el-input>
      <div style="margin-top: 15px; color: #f19332">
        温馨提示：请采用心脏听诊的方法记录心率。
      </div>
    </div>
    <div class="box">
      <span>身高：</span>
      <el-input
        placeholder="请输入身高"
        v-model="info.height"
        style="width: 300px"
        size="small"
        @blur="sum_tz"
      >
        <template slot="append">cm</template>
      </el-input>
      <div style="margin-top: 15px; color: #f19332">
        温馨提示：身高只需首诊测量。
      </div>
    </div>
    <div class="box">
      <span>体重：</span>
      <el-input
        placeholder="请输入体重"
        v-model="info.signWeight"
        style="width: 300px"
        size="small"
        @blur="sum_tz"
      >
        <template slot="append">kg</template>
      </el-input>
      <div style="margin-top: 15px; color: #f19332"></div>
    </div>
    <div class="box">
      <span>体质指数：</span>
      <el-input
        placeholder="请输入体质指数"
        v-model="info.signBmi"
        style="width: 300px"
        size="small"
        disabled
      >
        <template slot="append">kg/m2</template>
      </el-input>
      <div style="margin-top: 15px; color: #f19332"></div>
    </div>
    <div class="box">
      <span>腰围：</span>
      <el-input
        placeholder="请输入腰围"
        v-model="info.waistline"
        style="width: 300px"
        size="small"
      >
        <template slot="append">cm</template>
      </el-input>
      <div style="margin-top: 15px; color: #f19332">
        温馨提示：体重/腰围测量频率：超重/肥胖者，每3个月1次；非超重/肥胖者，每年1次。
      </div>
    </div>
    <p style="font-weight: 900; font-size: 20px; color: #000">吸烟</p>
    <div class="box">
      <p>您目前是否正在吸烟？</p>
      <el-radio-group v-model="info.smokingStatus">
        <el-radio label="1">是，几乎每天或大多数天吸烟</el-radio>
        <el-radio label="2">是，偶尔吸烟</el-radio>
        <el-radio label="3">否，已戒烟</el-radio>
        <el-radio label="4">否，从不吸烟</el-radio>
      </el-radio-group>
      <div v-if="info.smokingStatus == '1'">
        <p>您大约从几岁起开始养成每天或者基本每天都吸烟的习惯？</p>
        <el-input
          placeholder="请输入"
          v-model="info.startSmokeAge"
          style="width: 300px"
          size="small"
        >
          <template slot="append">岁</template>
        </el-input>
      </div>
      <div v-if="info.smokingStatus == '1' || info.smokingStatus == '2'">
        <p>您最近七天是否吸烟？</p>
        <el-radio-group v-model="info.lastSevendaysSmoke">
          <el-radio label="1">是</el-radio>
          <el-radio label="2">否</el-radio>
        </el-radio-group>
      </div>
    </div>
    <p style="font-weight: 900; font-size: 20px; color: #000">辅助检查</p>
    <div class="box">
      <p>请选择近三个月内做过或本次门诊准备做的各项检查（可多选）</p>
      <el-checkbox-group
        v-model="info.supplementary"
        style="display: inline-block"
      >
        <el-checkbox label="0">无</el-checkbox>
        <el-checkbox label="1">血常规</el-checkbox>
        <el-checkbox label="2">尿常规</el-checkbox>
        <el-checkbox label="3">血电解质（钾钠氯）</el-checkbox>
        <el-checkbox label="4">血肌酐</el-checkbox>
        <el-checkbox label="5">血糖</el-checkbox>
        <el-checkbox label="6">血脂</el-checkbox>
        <el-checkbox label="7">心电图</el-checkbox>
      </el-checkbox-group>
    </div>
    <p style="font-weight: 900; font-size: 20px; color: #000">
      目前用药及依从性
    </p>
    <div class="box">
      <div>
        <p>
          您目前是否在服用降压药、降脂(如他汀类)或抗血小板(如阿司匹林)等心血管病相关药物？
        </p>
        <div v-for="(item, index) in info.childsItems" :key="index">
          <div v-if="item.isCurrUseDrugs == 1">
            <el-autocomplete
              style="width: 457px"
              size="small"
              class="inline-input"
              v-model="item.drug"
              :fetch-suggestions="querySearch"
              placeholder="请输入内容"
              @select="handleSelect"
            >
              <template slot="prepend">药物名称</template>
            </el-autocomplete>
            <el-input
              placeholder="请输入..."
              v-model="item.dose"
              style="width: 457px; margin-left: 15px"
              size="small"
            >
              <template slot="prepend">单次剂量及单位</template>
              <el-select
                v-model="item.usageUnit"
                slot="append"
                style="width: 80px"
                placeholder="请选择"
              >
                <el-option label="mg" value="1"></el-option>
                <el-option label="g" value="2"></el-option>
                <el-option label="μg" value="3"></el-option>
                <el-option label="片" value="4"></el-option>
                <el-option label="粒" value="5"></el-option>
                <el-option label="胶囊" value="6"></el-option>
              </el-select>
            </el-input>
            <i
              class="el-icon-delete"
              style="margin-left: 15px"
              @click="info.childsItems.splice(index, 1)"
            ></i>
            <p style="margin-top: 15px">
              <span class="lable_box">用药频次</span>
              <el-select
                v-model="item.frequency"
                style="width: 200px"
                placeholder="请选择"
                size="small"
              >
                <el-option label="每日一次" value="1"></el-option>
                <el-option label="每日两次" value="2"></el-option>
                <el-option label="每日三次" value="3"></el-option>
                <el-option label="每日四次" value="4"></el-option>
                <el-option label="每晚一次" value="5"></el-option>
                <el-option label="必要时一次" value="6"></el-option>
                <el-option label="每周一次" value="7"></el-option>
                <el-option label="每周两次" value="8"></el-option>
                <el-option label="每周三次" value="9"></el-option>
                <el-option label="隔周一次" value="10"></el-option>
              </el-select>
              <span class="lable_box" style="margin-left: 10px">用法</span>
              <el-select
                v-model="item.drugUsage"
                style="width: 190px"
                placeholder="请选择"
                size="small"
              >
                <el-option label="口服" value="1"></el-option>
                <el-option label="舌下含服" value="2"></el-option>
                <el-option label="皮下注射" value="3"></el-option>
              </el-select>
              <span class="lable_box" style="margin-left: 10px"
                >降压药服药依从性</span
              >
              <el-select
                v-model="item.compliance"
                style="width: 200px"
                placeholder="请选择"
                size="small"
              >
                <el-option label="规律服药（80%以上）" value="1"></el-option>
                <el-option label="间断服药（10%-80%）" value="2"></el-option>
                <el-option label="很少或不服药（<10%）" value="3"></el-option>
              </el-select>
            </p>
            <!-- <p style="margin-top: 15px">
              <el-input
                placeholder="请输入..."
                v-model="info.服药依从性"
                style="width: 300px"
                size="small"
              >
                <template slot="prepend">服药依从性</template>
              </el-input>
            </p> -->
            <el-divider></el-divider>
          </div>
        </div>
        <p style="text-align: center">
          <el-button
            type="primary"
            plain
            size="small"
            style="width: 100%"
            @click="
              info.childsItems.push({
                drug: '',
                drugUsage: '',
                dose: '',
                frequency: '',
                compliance: '',
                usageUnit: '1',
                isCurrUseDrugs: '1',
              })
            "
            ><i class="el-icon-plus"></i> 新增用药情况</el-button
          >
        </p>
      </div>
    </div>
    <p style="font-weight: 900; font-size: 20px; color: #000">诊断</p>
    <div class="box">
      <el-checkbox-group
        v-model="info.diagResult"
        style="display: inline-block"
      >
        <el-checkbox label="1">高血压病</el-checkbox>
        <el-checkbox label="2">糖尿病</el-checkbox>
        <el-checkbox label="3">高脂血症</el-checkbox>
        <el-checkbox label="4">冠心病</el-checkbox>
        <el-checkbox label="5">心绞痛</el-checkbox>
        <el-checkbox label="6">心肌梗死</el-checkbox>
        <el-checkbox label="7">冠脉介入(支架)术后</el-checkbox>
        <el-checkbox label="8">冠脉搭桥术后</el-checkbox>
        <el-checkbox label="9">心力衰竭</el-checkbox>
        <el-checkbox label="10">心房颤动</el-checkbox>
        <el-checkbox label="11">脑卒中未分类</el-checkbox>
        <el-checkbox label="12">缺血性脑卒中</el-checkbox>
        <el-checkbox label="13">出血性脑卒中</el-checkbox>
        <el-checkbox label="14">慢性肾脏疾病</el-checkbox>
        <el-checkbox label="15">慢性阻塞性肺病</el-checkbox>
        <el-checkbox label="16">支气管哮喘</el-checkbox>
        <el-checkbox label="17">痛风</el-checkbox>
        <el-checkbox label="18">外周血管病</el-checkbox>
      </el-checkbox-group>
    </div>
    <p style="font-weight: 900; font-size: 20px; color: #000">生活方式指导</p>
    <div class="box">
      <p>
        您需要听从医生的建议努力戒烟，您目前体重正常范围，请继续保持；注意少吃咸食，远离烟酒，坚持运动，保持愉快心情！
      </p>
      <table border="1" cellspacing="0" style="width: 100%" class="table_rd_pd">
        <tr>
          <th>内容</th>
          <th>目标</th>
          <th>措施</th>
          <th>改善效果</th>
        </tr>
        <tr>
          <td>戒烟</td>
          <td>建议戒烟，避免被动吸烟</td>
          <td>
            1、宣传吸烟的危害，让患者产生戒烟愿望； <br />
            2、采取突然戒烟法，一次性完全戒烟；<br />
            3、对烟瘾大者可制定逐渐减少吸烟量的目标，
            每次设定患者可接受的小目标，鼓励患者坚持达标；<br />
            4、告诫患者离开吸烟环境，克服吸烟依赖心理；<br />
            5、用体力活动或其他爱好占用休闲时间，转移注意力；<br />
            6、取得家人的支持，协作监督和鼓励；<br />
            7、戒断症状明显的可用尼古丁贴片或安非他酮；<br />
            8、避免吸二手烟。
          </td>
          <td>降低心血管发病风险达40％，降低癌症发生风险</td>
        </tr>
        <tr>
          <td>戒酒</td>
          <td>推荐不饮酒，目前在饮酒的高血压患者，建议戒酒</td>
          <td>
            1、饮酒可导致降压药物疗效下降；<br />
            2、目前在饮酒的高血压患者建议戒酒，如暂时无法完全戒酒，应尽可能减少饮酒量；<br />
            3、鼓励家人协作患者戒酒。<br />
          </td>
          <td>可使收缩压至少下降达2-4mmHg</td>
        </tr>
        <tr>
          <td>减少钠盐摄入</td>
          <td>每人每日食盐摄入量不超过6克（一啤酒瓶盖）</td>
          <td>
            1、每日烹饪用盐总量限制：普通啤酒瓶盖去掉胶皮垫后水平装满可盛6克食盐，按家庭每日用餐人数称量，为每日最大用
            盐，其他食品含盐量应计算在内；<br />
            2、尽量少吃咸菜、酱、腌制肉类等含盐量高的食品；<br />
            3、尽量少吃袋装小食品，注意其含盐量；<br />
            4、减少外出餐馆就餐的次数。
          </td>
          <td>收缩压下降2-8mmHg-4mmHg</td>
        </tr>
        <tr>
          <td>规律运动</td>
          <td>运动，每次30分钟，每周5-7次</td>
          <td>
            1、根据自身身体状态、爱好及条件灵活选择，步行、快走、慢跑、游泳、太极拳、健身操等项目均可；<br />
            2、运动的强度：运动中心率（次/分钟）=170-年龄；<br />
            3、一次运动时间不足30分钟，可以累计。
          </td>
          <td>可使收缩压下降达4-9mmHg</td>
        </tr>
        <tr>
          <td>心理平衡</td>
          <td>减轻精神压力，保持平衡心理</td>
          <td>
            1、保持乐观情绪，及时释放压力，可通过找朋友倾诉、听音乐、运动、旅行等方式，必要时进行心理咨询；<br />
            2、调整好睡眠，必要时可借助药物。
          </td>
          <td>可有效降低血压</td>
        </tr>
      </table>
    </div>
    <p style="font-weight: 900; font-size: 20px; color: #000">药物治疗</p>
    <div class="box">
      <div>
        <p>
          本次就诊后的药物治疗方案（仅录入降压、降脂及抗血小板药物，在目前用药列表中进行增删）
        </p>
        <div v-for="(item, index) in info.childsItems" :key="index">
          <div v-if="item.isCurrUseDrugs == 0">
            <el-autocomplete
              style="width: 457px"
              size="small"
              class="inline-input"
              v-model="item.drug"
              :fetch-suggestions="querySearch"
              placeholder="请输入内容"
              @select="handleSelect"
            >
              <template slot="prepend">药物名称</template>
            </el-autocomplete>
            <el-input
              placeholder="请输入..."
              v-model="item.dose"
              style="width: 457px; margin-left: 15px"
              size="small"
            >
              <template slot="prepend">单次剂量及单位</template>
              <el-select
                v-model="item.usageUnit"
                slot="append"
                style="width: 80px"
                placeholder="请选择"
              >
                <el-option label="mg" value="1"></el-option>
                <el-option label="g" value="2"></el-option>
                <el-option label="μg" value="3"></el-option>
                <el-option label="片" value="4"></el-option>
                <el-option label="粒" value="5"></el-option>
                <el-option label="胶囊" value="6"></el-option>
              </el-select>
            </el-input>
            <i
              class="el-icon-delete"
              style="margin-left: 15px"
              @click="info.childsItems.splice(index, 1)"
            ></i>
            <p style="margin-top: 15px">
              <span class="lable_box">用药频次</span>
              <el-select
                v-model="item.frequency"
                style="width: 200px"
                placeholder="请选择"
                size="small"
              >
                <el-option label="每日一次" value="1"></el-option>
                <el-option label="每日两次" value="2"></el-option>
                <el-option label="每日三次" value="3"></el-option>
                <el-option label="每日四次" value="4"></el-option>
                <el-option label="每晚一次" value="5"></el-option>
                <el-option label="必要时一次" value="6"></el-option>
                <el-option label="每周一次" value="7"></el-option>
                <el-option label="每周两次" value="8"></el-option>
                <el-option label="每周三次" value="9"></el-option>
                <el-option label="隔周一次" value="10"></el-option>
              </el-select>
              <span class="lable_box" style="margin-left: 10px">用法</span>
              <el-select
                v-model="item.drugUsage"
                style="width: 190px"
                placeholder="请选择"
                size="small"
              >
                <el-option label="口服" value="1"></el-option>
                <el-option label="舌下含服" value="2"></el-option>
                <el-option label="皮下注射" value="3"></el-option>
              </el-select>
              <!-- <span class="lable_box" style="margin-left: 10px"
                >降压药服药依从性</span
              >
              <el-select
                v-model="item.compliance"
                style="width: 200px"
                placeholder="请选择"
                size="small"
              >
                <el-option label="规律服药（80%以上）" value="1"></el-option>
                <el-option label="间断服药（10%-80%）" value="2"></el-option>
                <el-option label="很少或不服药（<10%）" value="3"></el-option>
              </el-select> -->
            </p>
            <!-- <p style="margin-top: 15px">
              <el-input
                placeholder="请输入..."
                v-model="info.服药依从性"
                style="width: 300px"
                size="small"
              >
                <template slot="prepend">服药依从性</template>
              </el-input>
            </p> -->
            <el-divider></el-divider>
          </div>
        </div>
        <p style="text-align: center">
          <el-button
            type="primary"
            plain
            size="small"
            style="width: 100%"
            @click="
              info.childsItems.push({
                drug: '',
                drugUsage: '',
                dose: '',
                frequency: '',
                compliance: '',
                usageUnit: '1',
                isCurrUseDrugs: '0',
              })
            "
            ><i class="el-icon-plus"></i> 新增用药情况</el-button
          >
        </p>
      </div>
    </div>
    <div class="box">
      <span>下次随访日期：</span>
      <el-date-picker
        v-model="info.nextDate"
        align="right"
        type="date"
        placeholder="选择下次随访日期"
        :picker-options="pickerOptions"
        size="small"
      >
      </el-date-picker>
    </div>
    <div class="box">
      <span>随访人：</span>
      <!-- <el-select
        filterable
        placeholder="请选择随访人"
        size="small"
        style="width: 200px"
        v-model="info.unitName"
      >
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
      <el-select
        filterable
        placeholder="请选择随访人"
        size="small"
        style="width: 200px; margin-left: 20px"
        v-model="info.executorName"
      >
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select> -->
      <el-input
        placeholder=""
        v-model="info.executorName"
        style="width: 220px"
        size="small"
      >
        <!-- <template slot="append">℃</template> -->
      </el-input>
    </div>
    <div class="box">
      <span>随访机构：</span>
      <!-- <el-select
        filterable
        placeholder="请选择随访人"
        size="small"
        style="width: 200px"
        v-model="info.unitName"
      >
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
      <el-select
        filterable
        placeholder="请选择随访人"
        size="small"
        style="width: 200px; margin-left: 20px"
        v-model="info.executorName"
      >
        <el-option
          v-for="item in options"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select> -->
      <el-input
        placeholder=""
        v-model="info.unitName"
        style="width: 220px"
        size="small"
      >
        <!-- <template slot="append">℃</template> -->
      </el-input>
    </div>
    <div class="box" v-if="false">
      <span>随访照片：</span>
      <el-button
        icon="el-icon-upload2"
        type="primary"
        style="background-color: #fff; color: rgb(46, 160, 254)"
        size="small"
        plain
        >本地上传文件</el-button
      >
      <el-button
        icon="el-icon-picture-outline"
        type="primary"
        style="background-color: #fff; color: rgb(46, 160, 254)"
        size="small"
        plain
        >加载手机图片</el-button
      >
      <p style="margin-top: 10px">
        扫描二维码，在手机端点击"上传"图片，在手机端上传后，点击上方"加载手机照片"按钮，即可同步到电脑端
      </p>
      <div>
        <img
          style="width: 100px"
          src="http://8.218.107.5:9992/media/base/zhengjian/qrcode/16863931874Q68253F.png"
          alt=""
        />
        <img
          style="width: 100px; margin-left: 20px"
          src="http://8.218.107.5:9992/media/base/zhengjian/qrcode/16863931874Q68253F.png"
          alt=""
        />
      </div>
    </div>
  </div>
</template>
    
    <script>
export default {
  data() {
    return {
      info: {
        hospitalId: window.localStorage.getItem("hospitalId"),
        idNo: localStorage.getItem("idCard"),
        residentName: window.localStorage.getItem("residentName"),
        createUserId: window.localStorage.getItem("doctorName"),
        hypertensivePatientsChilds: [{ drugid: 1 }],
        supplementary: [],
        diagResult: [],
        pasthistory: [],
        complicationsItems: [
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
          { newComplication: "", newComplicationTime: "" },
        ],
        childsItems: [
          {
            drug: "",
            drugUsage: "",
            dose: "",
            frequency: "",
            compliance: "",
            usageUnit: "1",
            isCurrUseDrugs: "1",
          },
        ],
      },
      options: [
        {
          value: "测试",
          label: "测试",
        },
      ],
      pickerOptions: {
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            },
          },
        ],
      },
      value2: "",
      isLoading: true,
      isId: "",
      checkbox_list: [],
      restaurants: [],
      queryString: "",
      isTopDialog: false,
    };
  },
  props: {
    sf_flag: { type: Number, default: 0 },
  },
  mounted() {
    if (this.sf_flag == 1) {
      this.info.firstVisit = 1;
      this.info.typeChildDetail = 0;
    }
    if (this.sf_flag == 2) {
      this.info.firstVisit = 0;
      this.info.typeChildDetail = 1;
    }
    if (this.sf_flag == 3) {
      this.info.firstVisit = 0;
      this.info.typeChildDetail = 0;
    }
    this.set_form();
  },
  methods: {
    btn_ok() {
      var url = this.info.id
        ? "/patientsServiceNew/Update"
        : "/patientsServiceNew/Insert";
      this.info.supplementary = this.info.supplementary.toString();
      this.info.diagResult = this.info.diagResult.toString();
      this.info.pasthistory = this.info.pasthistory.toString();
      var date = new Date();
      this.info.id
        ? (this.info.updatetime = date)
        : (this.info.createtime = date);
      var that = this;
      this.$post(url, this.info).then((res) => {
        if (res.code != 200) {
          this.$message({
            message: res.message,
            type: "error",
          });
          return;
        }
        this.$message({
          message: "操作成功",
          type: "success",
        });
      });
    },
    getInfo(item, flag) {
      this.isLoading = false;
      // this.info = item;
      this.isId = item.id;
      this.getOne(item.id, flag);
    },
    getOne(id, flag) {
      this.$post("/patientsServiceNew/getOne?id=" + id).then((res) => {
        this.info = res.data;
        if (this.info.diagResult == "") {
          this.info.diagResult = [];
        } else {
          this.info.diagResult = this.info.diagResult.split(",");
        }
        if (!this.info.pasthistory) {
          this.info.pasthistory = [];
        } else {
          this.info.pasthistory = this.info.pasthistory.split(",");
        }
        if (this.info.supplementary == "") {
          this.info.supplementary = [];
        } else {
          this.info.supplementary = this.info.supplementary.split(",");
        }
        if (this.info.complicationsItems.length < 12) {
          this.info.complicationsItems = [
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
            { newComplication: "false", newComplicationTime: "" },
          ];
        } else {
          for (var i in this.info.complicationsItems) {
            this.info.complicationsItems[i].newComplication =
              this.info.complicationsItems[i].newComplication == "true"
                ? true
                : false;
          }
        }
        this.isLoading = true;
        if (flag == "预览") {
          this.isTopDialog = true;
        }
      });
    },
    set_form() {
      this.isLoading = false;
      var d = new Date();
      d.setMonth(d.getMonth() + 3);
      var yy1 = d.getFullYear();
      var mm1 = d.getMonth() + 1; //因为getMonth（）返回值是 0（一月） 到 11（十二月） 之间的一个整数。所以要给其加1
      var dd1 = d.getDate();
      if (mm1 < 10) {
        mm1 = "0" + mm1;
      }
      if (dd1 < 10) {
        dd1 = "0" + dd1;
      }
      this.info.visitDate = new Date();
      this.info.nextDate = yy1 + "-" + mm1 + "-" + dd1;
      this.info.executorName = window.localStorage.getItem("doctorName");
      this.info.unitName = window.localStorage.getItem("hospitalName");
      this.isLoading = true;
    },
    clear_info() {
      this.info = {
        hospitalId: "3015",
        idNo: localStorage.getItem("idCard"),
        residentName: window.localStorage.getItem("residentName"),
        hypertensivePatientsChilds: [{ drugid: 1 }],

        supplementary: [],
        diagResult: [],
        pasthistory: [],
      };
    },
    querySearch(queryString, cb) {
      if (!queryString) {
        return;
      }
      this.queryString = queryString;
      this.getYao();
      setTimeout((_) => {
        cb(this.restaurants);
      }, 500);

      // 调用 callback 返回建议列表的数据
    },
    createFilter(queryString) {
      return (restaurant) => {
        return (
          restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) ===
          0
        );
      };
    },
    handleSelect(item) {},
    getYao(val) {
      this.$get(
        baseUrl.mbIp + "/api/His/GetMedicineList/" + this.queryString
      ).then((res) => {
        var arr = [];
        for (var i in res.Data) {
          arr.push(res.Data[i]);
          arr[i].value = arr[i].drug_name;
        }
        this.restaurants = arr;
      });
    },
    sum_tz() {
      if (!this.info.height || !this.info.signWeight) {
        return;
      }
      this.isLoading = false;
      this.info.signBmi = this.toBmi(this.info.height, this.info.signWeight);
      this.isLoading = true;
    },
    toBmi(height, weight) {
      var height2 = height / 100;
      var sum = 0;
      sum = weight / (height2 * height2);
      return Math.round(sum * 100) / 100;
    },
  },
};
</script>
    
    <style scoped lang="scss">
.gxyhzsf {
  .top {
    padding: 10px 20px;
    background-color: #e6f7ff;
    border: 1px solid #91d5ff;
  }
  .tab1 {
    tr {
      width: 100%;
      th {
        text-align: center;
        color: #000;
        background-color: rgb(250, 250, 250);
      }
      td {
        padding: 10px;
      }
    }
  }
  .box {
    padding: 10px 250px;
    background-color: rgb(250, 250, 250);
    margin: 10px 0;
  }
}
.table_rd_pd {
  th,
  td {
    padding: 5px 10px;
  }
}
.lable_box {
  background-color: #f5f7fa;
  color: #909399;
  vertical-align: middle;
  display: inline-block;
  border: 1px solid #dcdfe6;
  border-radius: 4px;
  padding: 0 20px;
  line-height: 30px;
}
.pointer {
  pointer-events: none;
}
</style>